<template>
	<view class="item bgf mt20 ml30 mr30 r20 pl30 pr30 useAnimate" @click="$go('/pages/workerClient/order/detail?id='+item.order.id)"
	v-for="item in data"
	:key="item.id"
	>
		<view class="t-flex between title">
			<view class="c3">订单号：{{item.order.order_sn}}</view>
			<view class="mainC">已核销</view>
		</view>
		
		<view class="goods t-flex between pt30 pb30" >
			<uv-image :src="$str.img(item.order.good_image)" mode="aspectFill"
			width="200rpx"
			height="160rpx"
			radius="20rpx"
			></uv-image>
			<view class="right ml30">
				<view class="f32 c3 bold">
					{{item.good_name}}{{item.good_title}}
				</view>
				<view class="f32 bold price">
					<text class="prc mr20">￥{{item.price}}</text>
				</view>				
			</view>
		</view>
		
		
		<view class="actions t-flex between pb20">
			<view class="f24 c9">
				{{$time(item.hx_time,5)}}
			</view>	
			<view class="btns mt30 t-flex">
				<view class="btn t-flex center">查看详情</view>
				<view class="btn t-flex center s2"
				@click.stop="miniPre(item.ht_info)"
				>查看合同</view>
			</view>
				
		</view>
		
	</view>
	<empty msg="暂无核销记录" v-if="data.length === 0"></empty>
	<view class="bpad"></view>
</template>

<script setup lang="ts">
	import { onLoad,onPullDownRefresh,onReachBottom} from "@dcloudio/uni-app"
	import { miniPre, usePaging } from "../../../lib/ts/util";
	

	
	const {
		data,
		reload,
		getMore
	} = usePaging('/api/master/HxLog')
	
	
	onLoad(()=>{
		reload()
	})
	onPullDownRefresh(()=>{
		reload()
	})
	onReachBottom(()=>{
		getMore()
	})

</script>

<style scoped lang="scss">
	.title{
		padding: 30rpx 0;
		border-bottom: 2rpx solid #F5F5F5;;
	}
	.goods{
		.right{
			width: calc(100% - 230rpx);
		}
		.price{
			margin-top: 40rpx;
			.prc{
				color: #FF1616;
			}
			.mprc{
				color: #BBBBBB;
				text-decoration: line-through;
				font-weight: 400;
			}
		}
	}
	
	.actions{
		.btn{
			width: 160rpx;
			height: 68rpx;
			background: #FFFFFF;
			border-radius: 35rpx;
			border: 2rpx solid #EEEEEE;
			color: #666;
		}
		.btn.s2{
			background-color: $main-color;
			border-color: $main-color;
			color: #fff;
			margin-left: 24rpx;
		}
	}
	
	.select{
		background-color: #F5F6F7;
		.right{
			width: 70%;
			text-align: right;
			.iconfont{
				color: #999;
			}
		}
	}
	
	
	
	
</style>
